<template>
  <div>
    <form action="/">
      <van-search
        v-model="communityName"
        show-action
        @input="fn"
        placeholder="请输入搜索关键词"
        @cancel="$router.push({ path: '/publish' })"
      />
    </form>
    <!-- 展示搜索结果 -->
    <div v-for="(item, index) in communityInfo" :key="index">
      <van-cell
        :title="item.communityName"
        @click="
          $router.push({
            path: '/publish',
            query: { value: item.communityName }
          })
        "
      />
    </div>
  </div>
</template>

<script>
import { getCommunity, getCityName } from '@/api/user'
export default {
  data () {
    return {
      value: '',
      id: '',
      communityName: '',
      community: '',
      communityInfo: []
    }
  },
  async created () {
    const data = await getCityName()
    this.id = data.body.value
    await getCommunity(this.value, this.id)
  },
  methods: {
    async fn () {
      const data = await getCommunity(this.value, this.id)
      this.communityInfo = data.body
    },
  }
}
</script>

<style></style>
